import React from "react";
import {observer, inject} from 'mobx-react';
import {toJS} from 'mobx';
import {withRouter} from 'react-router-dom';
import {Checkbox, Tools, Toast, Button, Icon} from "weaver-mobile";
import {ListAdvanced, RouteLayout} from 'weaver-mobile-page';
import '../../style/adjustLog/adjustLogStyle.less';
import * as mobx from "mobx";

const getLabel = Tools.getLabel;

@withRouter
@inject("odocComsStore", "adjustLogStore")
@observer
export default class Main extends React.Component {
    constructor(props) {
        super(props);
    }


    componentWillMount() {
        const {adjustLogStore, location, odocComsStore} = this.props;
        const {init} = adjustLogStore;
        const {pathname = ""} = location;
		let {requestParam = {}} = odocComsStore;
		requestParam = mobx.toJS(requestParam);
		delete requestParam.markInfo;
        init(pathname, requestParam);
    }

    render() {
        const {adjustLogStore} = this.props;
        const {listAd, dataParams} = adjustLogStore;
        const {params, contionUrl} = dataParams;

        let listparams = {
            store: listAd,
            rowKey: "id",
            hasAdvanceSerach: true,
            treeKey: "id",
            className: "adjustLogList",
            showSearchBar: false,
            conditionFetchOptions: {
                url: contionUrl,
                method: "POST",
                params: {...params},
            },
            onSearch: this.onSearch,
            getTemplate: (template) => {
                return ({json: this.getTemplate()})
            }

        }
        return (
            <div className={"adjustLogContent"}>
                <div className={"adjust-Btn"}>
                    {this.getTopBtn()}
                </div>
                <ListAdvanced {...listparams} />
            </div>
        );
    }

    getTopBtn = () => {
        const {adjustLogStore, history} = this.props;
        const {listAd} = adjustLogStore;
        const {searchAdvancedStore = {}} = listAd;
        const {route, id} = searchAdvancedStore;

        return [
            <Button  onClick={() => {
                history.push({
                    pathname: route + "/" + id,
                    state: {dialogType: 1, title: getLabel(347, "高级搜索")}
                });
            }}><Icon key="filter-o" type="filter-o" size={'sm'} style={{"vertical-align": "middle"}}/></Button>,
        ]
    }

    getTemplate = () => {
        const template = [
            {
                key: 'col1',
                configs: [
                    {
                        key: 'row1',
                        render: (data, value, index) => {
                            const {
								opdate, opdatespan, userid, useridspan, operatype, operatypespan,
                                objectname, objectnamespan, nodeidspan, nodeid, remark, remarkspan,
                                clientip, clientipspan,
                            } = data;

                            return <div className={"list_row1_item"}>
                                <div className={"operator list_item"}>
                                    <span className={"title"}>{getLabel(15502, "操作时间") + ":"}</span>
                                    <span className={"content"}>{opdatespan || opdate}</span>
                                </div>
                                <div className={"list_item"}>
                                    <span className={"title"}>{getLabel(99, "操作者") + ":"}</span>
                                    <span className={"content"}>{useridspan || userid}</span>
                                </div>
                                <div className={"list_item"}>
                                    <span className={"title"}>{getLabel(15503, "操作类型") + ":"}</span>
                                    <span className={"content"}>{operatypespan || operatype}</span>
                                </div>
                                <div className={"operator list_item"}>
                                    <span className={"title"}>{getLabel(106, "对象") + ":"}</span>
                                    <span className={"content"}>{objectnamespan || objectname}</span>
                                </div>
                                <div className={"list_item"}>
                                    <span className={"title"}>{getLabel(511479, "流转环节") + ":"}</span>
                                    <span className={"content"}>{nodeidspan || nodeid}</span>
                                </div>

                                <div className={"list_item"}>
                                    <span className={"title"}>{getLabel(17614, "签字意见") + ":"}</span>
                                    <span className={"content"}
                                          dangerouslySetInnerHTML={{__html: remarkspan}}/>
                                </div>
                                <div className={"list_item"}>
                                    <span className={"title"}>{getLabel(17484, "客户端地址") + ":"}</span>
                                    <span className={"content"}>{clientipspan || clientip}</span>
                                </div>
                            </div>
                        }
                    },
                ],
            },
        ]
        return template;
    }

    onSearch = () => {
        const {adjustLogStore} = this.props;
        const {getData} = adjustLogStore;
        getData();
    }
}